<script setup lang="ts">
import GreenBtn from "./GreenBtn.vue";

defineProps({
  gap: {
    type: Number,
    default: 54,
  },
});
</script>
<template>
  <div class="mainButton">
    <GreenBtn class="btn1">查看演示</GreenBtn>
    <GreenBtn class="btn2">
      <img src="/index/down.png" alt="" />
      立即免费安装
    </GreenBtn>
  </div>
</template>

<style lang="scss" scoped>
@import "../../utils/scss/global.scss";
@include mobile {
  .mainButton {
    .btn1,
    .btn2 {
      margin-bottom: 10px;
    }
    .btn2 {
      margin-left: 12px !important;
    }
  }
}
.mainButton {
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;

  :deep(a) {
    color: #fff;
  }

  .btn2 {
    margin-left: 54px;
  }
  img {
    margin-right: 10px;
  }
}
</style>
